<script setup lang="ts">
import { useRouter } from "vue-router";
import { onMounted, ref } from "vue";
import { getCurrentLoginUserState } from "@/state/userState";

const router = useRouter();
let user = ref(null);
onMounted(async () => {
  user.value = await getCurrentLoginUserState();
  if (!user.value) {
    router.replace("/user/login");
  }
});
const doEdit = (value, key, property) => {
  router.push({
    path: "/user/edit",
    query: {
      value,
      key,
      property,
    },
  });
};
</script>

<template>
  <template v-if="user">
    <van-cell
      title="昵称"
      :value="user.username"
      is-link
      @click="doEdit(user.username, '昵称', 'username')"
    />
    <van-cell
      title="账号"
      :value="user.userAccount"
      is-link
      @click="doEdit(user.userAccount, '账号', 'userAccount')"
    />
    <van-cell
      title="图像"
      is-link
      @click="doEdit(user.avatarUrl, '图像', 'avatarUrl')"
    >
      <template #value>
        <img :src="user.avatarUrl" style="width: 50px" />
      </template>
    </van-cell>
    <van-cell
      title="性别"
      :value="user.gender == 0 ? '男' : '女'"
      is-link
      @click="doEdit(user.gender, '性别', 'gender')"
    />
    <van-cell
      title="电话"
      :value="user.phone"
      is-link
      @click="doEdit(user.phone, '电话', 'phone')"
    />
    <van-cell
      title="邮箱"
      :value="user.email"
      is-link
      @click="doEdit(user.email, '邮箱', 'email')"
    />
    <van-cell
      title="星球编号"
      :value="user.planetCode"
      is-link
      @click="doEdit(user.planetCode, '星球编号', 'planetCode')"
    />
    <van-cell
      title="标签"
      :value="user.tags"
      is-link
      @click="doEdit(user.tags, '标签', 'tags')"
    />
    <van-cell
      title="创建时间"
      :value="user.createTime"
      is-link
      @click="doEdit(user.createTime, '创建时间', 'createTime')"
    />
  </template>
</template>

<style scoped></style>
